// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.1

Rectangle {
    id: titleBox
    width: 1024
    height: 600
    color: "#00000000"
    property string lang
    Item {
        id: titleBox2

        width: 400
        height: 40
        z: 1

        LeftTitle{
            x: 10
            y: 0
            text: if(lang=="1" )"gallery"; else "galería";
            size: 32
        }
    }
    MouseArea {
        id: mouseRegion
        anchors.fill: parent;
        property variant clickedPosition: "1,1"

        onPressed: {
            clickedPosition  = Qt.point(mouse.x,mouse.y)
        }
        onPositionChanged: {
            var mousePosX = (mouse.x <0) ? 0 : mouse.x
           var mousePosY = (mouse.y <0) ? 0 : mouse.y
            var relative = Qt.point(mousePosX-clickedPosition.x, mousePosY-clickedPosition.y)
            titleBox.pos = Qt.point(titleBox.pos.x+relative.x,
                                    titleBox.pos.y+relative.y)

        }
    }
    GridView {
        id: gridView
        x: 10
        y: 40
        width: 400
        height: parent.height
        cellHeight: 120
        cellWidth: 120
        model: xmlThumbsModel
        delegate: Item {
            x: 5
            height: 100
            Column {
                spacing: 5
                Rectangle{
                    color: "#00000000"
                    width:100;height:100
                    radius: 5
                    border.color: "white"
                    border.width: 15

                    Image {
                        width: 100
                        height: 100
                        anchors.verticalCenter: parent.verticalCenter
                        anchors.horizontalCenter: parent.horizontalCenter
                        source: thumb
                        MouseArea{
                            id:thumbClick
                            x:0;y:0;
                            height:parent.height;width:parent.width;
                            onClicked:{console.log("index = " + index); bigImageContainer.source = xmlThumbsModel.get(index).big}
                        }
                    }
                }
            }
        }
    }
    XmlListModel {
        id: xmlThumbsModel
        source: "Assets/Gallery/data.xml"
        query: "/system/note"
        XmlRole { name: "thumb"; query: "thumb/string()" }
        XmlRole { name: "big"; query: "big/string()" }
    }

    Image {
        id: bigImageContainer
        x: 514
        y: 43
        width: 400
        height: 400
        source: bigImage
    }
}
//Westin
